<?php 
	$table = $this->table;
	$search_mode = $this->search_mode;
?>

<!-- 一覧場合 -->
<?php if(!$search_mode):?>

<section class="grid_12">
	<!-- 検索フォーム -->
	<div class="block-border" style="margin-bottom: 20px;">
    	<div class="block-content">
	        <h1>検索</h1>
	       <form method="post" class="form" action="/admin/order" id="search_form">
	        	<p>
        			<label for="start_time" class="inline">始め時間</label>
		        	<?php echo $this->formText("start_time")?>
		        	
		        	<label for="end_time" class="inline">終わり時間</label>
		        	<?php echo $this->formText("end_time")?>
		        </p>
		        
		        <p>
		        	<label for="start_time" class="inline">予約状態</label>
					<?php echo $this->formSelect("status", NULL, NULL, $this->order_status_list)?>
					<label for="room_code" class="inline">会議室/ブース</label>
					<?php echo $this->formSelect("room", NULL, NULL, $this->room_code_list)?>		        	
		        	<button type="submit" id="save_btn">検索</button>
		        </p>
	        </form>
    	</div>
	</div>

	<!-- 一覧 -->
	<div id="table_container">
		<?php echo $this->partial("/component/table.phtml", array('table'=>$table,'table_translate'=>$this->table_translate))?>
	</div>
	
	<?php echo $this->formHidden("msg", $this->msg);?>
</section>



<!-- Order start dialog -->
<div id="order-start-dialog" style="display:none">
	<form class="form" id="order-start-form">
			<fieldset class="grey-bg inline-label">
				<legend>予約情報</legend>
				<?php echo $this->formHidden("start_order_id", 0)?>
				<p>
					<label for="user">予約ユーザ</label>
					<span id="username"></span>
				</p>
				
				<p>
					<label for="room">会議室</label>
					<span id="room_code"></span>
					(<span id="rent_price"></span>)
				</p>
				
				<p>
					<label for="date">予約日</label>
					<span id="order_date"></span>
				</p>
				
				<p>
					<label for="order_time">予約時間</label>
					<span id="order_time"><?php echo $this->start_time . " ~ " . $this->end_time?></span>
				</p>
				
				<p>
					<label for="name">料金</label>
					<span id="fee"></span>
				</p>
			</fieldset>
		</form>
</div>

<div id="order-end-dialog" style="display:none">
	<form class="form" id="order-end-form">
			<fieldset class="grey-bg inline-label">
				<legend>予約情報</legend>
				<?php echo $this->formHidden("end_order_id", 0)?>
				<p>
					<label for="user">予約ユーザ</label>
					<span id="username"></span>
				</p>
				
				<p>
					<label for="room">会議室</label>
					<span id="room_code"></span>
					(<span id="rent_price"></span>)
				</p>
				
				<p>
					<label for="date">予約日</label>
					<span id="order_date"></span>
				</p>
				
				<p>
					<label for="order_time">予約時間</label>
					<span id="order_time"><?php echo $this->start_time . " ~ " . $this->end_time?></span>
				</p>
				
				<p>
					<label for="name">料金</label>
					<span id="fee"></span>
				</p>
			</fieldset>
		</form>
</div>
<?php else :?>
	<!-- Ajax mode -->
	<!-- AJAXで検索する場合 -->
	<?php echo $this->partial("/component/table.phtml", array('table'=>$table,'table_translate'=>$this->table_translate))?>

<?php endif;?>


<?php if(!$search_mode):?>
<!-- Table script -->
<script type="text/javascript" src="/js/table.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("#status").change(function(){
			refreshTable();
			return false;
		});

		$("#room").change(function(){
			refreshTable();
			return false;
		});
		
		
		$("#search_form").submit(function(){
			refreshTable();
			return false;
		});

		if($("#msg").val() != null && $("#msg").val() != ''){
			notify($("#msg").val());
		}

		$("#start_time").datepicker({ 
			dateFormat: 'yy-mm-dd',
			changeMonth: true,
			changeYear: true,
			showOn: "button",
			buttonImage: "/images/icons/calendar.gif",
			buttonImageOnly: true,
			onClose: function(dateText, inst) {
			}
		});

		$("#end_time").datepicker({ 
			dateFormat: 'yy-mm-dd',
			changeMonth: true,
			changeYear: true,
			showOn: "button",
			buttonImage: "/images/icons/calendar.gif",
			buttonImageOnly: true,
			onClose: function(dateText, inst) {
			}
		});
	});	

	//テーブルのデータをロード
	function refreshTable(){
		var ajax_url = "/admin/order";
		
		var datas = "start_time=" + $("#start_time").val();
		datas += "&search_key=" + $.trim($("#search_key").val());
		datas += "&line_per_page=" + $("#line_per_page").val();
		datas += "&page=" + $("#page").val();
		datas += "&search=1";

		if($("#status").val() != "" && $("#status").val() != undefined)
			datas += "&status=" + $("#status").val();

		if($("#room").val() != "" && $("#room").val() != undefined)
			datas += "&room=" + $("#room").val();
		
		$(".black-cell span").attr('class','loading');
		jQuery.ajax({
			  url: ajax_url,
			  type: "POST",
			  data: datas,
			  success: function(data) {
				  $("#table_container").html(data);
			  },
			  complete: function(){	
				   $(".black-cell span").attr('class','success');
			  },
			  error: function() {
				  alert("サーバエラー");
			  }
		});
	}

	function doStart(link_object, order_id){
		var row = $(link_object).parent().parent().parent().parent();
		var data_cells = $(row).find("td");

		//get row data
		var username = $(data_cells[1]).text();
		var room_code = $(data_cells[2]).text();
		var rent_price = $(data_cells[3]).text();
		var registed_time = $(data_cells[4]).text();
		var start_time = $(data_cells[5]).text();
		var end_time = $(data_cells[6]).text();
		var fee = $(data_cells[7]).text();

		//set data to dialog
		$("#order-start-form #username").html(username);
		$("#order-start-form #room_code").html(room_code);
		$("#order-start-form #rent_price").html(rent_price);
		$("#order-start-form #fee").html(fee + " VND");
		$("#order-start-form #order_date").html(registed_time.substring(0, 10));
		$("#order-start-form #order_time").html(start_time.substring(11, 16) + "~" + end_time.substring(11, 16));
		$("#order-start-form #start_order_id").val(order_id);
		
		openOrderStartDialog();
	}

	function doEnd(link_object, order_id){
		var row = $(link_object).parent().parent().parent().parent().parent();
		var data_cells = $(row).find("td");

		//get row data
		var username = $(data_cells[1]).text();
		var room_code = $(data_cells[2]).text();
		var rent_price = $(data_cells[3]).text();
		var registed_time = $(data_cells[4]).text();
		var start_time = $(data_cells[5]).text();
		var end_time = $(data_cells[6]).text();
		var fee = $(data_cells[7]).text();

		//set data to dialog
		$("#order-end-form #username").html(username);
		$("#order-end-form #room_code").html(room_code);
		$("#order-end-form #rent_price").html(rent_price);
		$("#order-end-form #fee").html(fee + " VND");
		$("#order-end-form #order_date").html(registed_time.substring(0, 10));
		$("#order-end-form #order_time").html(end_time.substring(11, 16) + "~" + end_time.substring(11, 16));
		$("#order-end-form #end_order_id").val(order_id);
		
		openOrderEndDialog();
	}

	function openOrderStartDialog()
	{
		$.modal({
			content: $("#order-start-dialog").html(),
			title: '予約スタート',
			maxWidth: 500,
			buttons: {
				"閉じる": function(win) { win.closeModal(); },
				"スタート": function(win) {
					updateOrderStatus($("#start_order_id").val(), 3); 
					win.closeModal(); 
				}
			}
		});
	}

	function openOrderEndDialog()
	{
		$.modal({
			content: $("#order-end-dialog").html(),
			title: '予約エンド',
			maxWidth: 500,
			buttons: {
				"閉じる": function(win) { win.closeModal(); },
				"エンド": function(win) {
					updateOrderStatus($("#end_order_id").val(), 4); 
					win.closeModal(); 
				}
			}
		});
	}

	function updateOrderStatus(order_id, status){
		var ajax_url = "/admin/order/update-status";
		
		var datas = "order_id=" + order_id;
		datas += "&status=" + status;
		
		jQuery.ajax({
			  url: ajax_url,
			  type: "POST",
			  data: datas,
			  success: function(data) {
				  refreshTable();
			  },
			  complete: function(){	
			  },
			  error: function() {
				  alert("サーバエラー");
			  }
		});
	}
</script>
<?php endif;?>